<div class="portlet light bordered">
	<div class="portlet-title">
        <div class="caption font-dark">
            <i class="fa fa-cog font-dark"></i>
            <span class="caption-subject bold">添加</span>
        </div>
    </div>
    <div class="portlet-body form">
    	<form role="form" action="/bottomLink/edit" class="form-horizontal" method="post">
        	<div class="form-body">
        		<div class="form-group #if($!pid==0) hidden #end">
                     <label class="control-label col-md-2">分组名称：</label>
                     <label class="control-label col-md-1">$!pItem.name</label>
                 </div>
                 
        	 	<div class="form-group">
                     <label class="control-label col-md-2">#if($!pid==0)分组 #else 链接#end 名称：</label>
                     <div class="col-md-3">
                         <input type="text" class="form-control" name="name" value="$!item.name">
                         <input type="hidden" name="id" value="$!item.id">
                         <input type="hidden" name="pid" value="$!item.pid">
                     </div>
                 </div>
                 <div class="form-group">
                     <label class="control-label col-md-2">链接位置：</label>
                     <div class="col-md-3">
                         <select class="form-control" name="loc" id="loc" required>
							<option></option>
							<option value="bottom" #if($!item.loc == 'bottom') selected #end >底部链接</option>
                       		<option value="footer" #if($!item.loc == 'footer') selected #end >footer链接</option>
                       		<option value="header" #if($!item.loc == 'header') selected #end >头部导航</option>
                       		<option value="center" #if($!item.loc == 'center') selected #end >个人中心</option>
						</select>
                     </div>
                 </div>
                 <div class="form-group">
					<label class="control-label col-md-2">广告图片：</label>
					<div class="col-md-4">
	                    <div class="mt-element-overlay">
							<div class="mt-overlay-1 fileinput fileinput-new" data-provides="fileinput" style="margin-bottom: 0;width: auto;;height: auto;">
								<div class="fileinput-new thumbnail" style="width: 150px; height: 150px; margin-bottom: 0">
								    <img src="$!item.image" alt="上传图片"> 
								</div>
								<div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 150px; max-height: 150px;margin-bottom: 0"> </div>
								<div class="mt-overlay">
								    <span class="btn default btn-file" style="padding: 0;">
									    <span class="fileinput-new"> 浏览 </span>
									    <span class="fileinput-exists"> 更改 </span>
									    <input type="file"  class="uploadProdImage" id="uploadImage" accept="image/jpg,image/gif,image/bmp,image/jpeg,image/png"> 
								    </span>`
								    <a href="javascript:;" class="btn red fileinput-exists" data-dismiss="fileinput" style="padding: 0"> 删除 </a>
								    <input type="hidden" name="image" id="bottomLinkImg"  value="$!item.image"/>
								</div>
                        	</div>
						</div>
					</div>
				</div>
                 <div class="form-group">
                     <label class="control-label col-md-2">链接地址：</label>
                     <div class="col-md-3">
                         <input type="text" class="form-control" name="link_url" value="$!item.link_url">
                     </div>
                 </div>
                  
                <div class="form-group">
					<label class="control-label col-md-2">是否启用：</label>
					<div class="col-md-4" style="vertical-align: middle; margin-top: 7px;">
						<input type="radio" name="status" value="true" #if($!item.status) checked #end>
						启用
						<input type="radio" name="status" value="false" #if(!$!item.status) checked #end>
						禁用
					</div>
				</div>
				<div class="form-group">
					<label class="control-label col-md-2">排序：</label>
					<div class="col-md-3">
						<input type="text" class="form-control positiveIntegerNum" name="sort" value="$!item.sort">
					</div>
				</div>
				
            </div>
            <div class="form-actions right">
				<a href="javascript:;" thref="/bottomLink/friend" class="btn green ajax-post"><i class="fa fa-check"></i> 提交</a>
				<a href="/bottomLink/friend" class="btn btn-outline grey-salsa ajaxify">返回</a>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript">

$(function() {
	MyTouchSpin.init() ;
	
	$("#uploadImage").on("change", function() {
		var files = this.files;
		var formData = new FormData();
		for (var i = 0; i < files.length; i++) {
			var fileSize = parseInt(files[i].size / 1024).toFixed(0);
			if (fileSize > 1024) {
				toastr.warning("单张图片大小不要超过1M");
				return false
			}
			formData.append("file", files[i]);
		}
		;
		$.ajax({
			url : "/upload-pageCfg",
			type : "post",
			data : formData,
			contentType : false,
			processData : false,
			dataType : "html",
			success : function(res) {
				var data = JSON.parse(res);
				$('#bottomLinkImg').attr('value', data.url);
			}
		})
	}) ;
})

</script>
